<template>
  <view class="page">
    <button
      open-type="contact"
      @contact="handleContact"
      class="btn"
      :style="{
        backgroundImage: `url(${webSrc('/assets/web_img/my/service1.png')})`,
      }"
    />
    <!-- <button
      @click="handleCall('trade_special')"
      class="btn"
      :style="{
        backgroundImage: `url(${webSrc('/assets/web_img/my/service2.png')})`,
      }"
    /> -->
    <button
      @click="handleCall('service_hotline')"
      class="btn"
      :style="{
        backgroundImage: `url(${webSrc('/assets/web_img/my/service3.png')})`,
      }"
    />
    <u-text :text="`工作时间：${detail.work_hours || '无'}`" color="#BABABA" size="14" />
  </view>
</template>

<script>
import { myService } from "@/request/myApi.js";
export default {
  data() {
    return {
      detail: {}, // 联系信息
    };
  },
  onLoad() {
    this.getData();
  },
  methods: {
    // 获取专线信息
    getData() {
      myService().then((res) => {
        if (res.code == 1) {
          this.detail = res.data;
        }
      });
    },
    // 打开客服
    handleContact(e) {
      console.log(e);
    },
    // 买卖专线/服务热线
    handleCall(val) {
      uni.makePhoneCall({
        phoneNumber: this.detail[val],
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.page {
  padding: 20rpx;
  .btn {
    width: 100%;
    height: 156rpx;
    background-size: 100% 100%;
    margin-bottom: 20rpx;
    &::after {
      border: 1px solid transparent;
    }
  }
}
</style>
